﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>我的万能券</title>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../css/ydui.css?v=1.1.4" rel="stylesheet" />
    <script src="../js/ydui.flexible.js"></script>
	<link rel="stylesheet" type="text/css" href="../css/all.css?v=20180302"/>
</head>
	<body ms-controller="quanlist" class="ms-controller">
		<div class="g-flexview">
	        <header class="m-navbar">
	            <a href="coinbox.html" class="navbar-item"><i class="back-ico"></i></a>
	            <div class="navbar-center"><span class="navbar-title">我的万能券</span></div>
	        </header>				
			<div class="g-scrollview">
                <ul class="tab-nav">
                    <li class="tab-nav-item" ms-class="[@status==1&&'tab-active']"><a href="javascript:;" ms-on-tap="@Query(1)">未使用</a></li>
                    <li class="tab-nav-item" ms-class="[@status==2&&'tab-active']"><a href="javascript:;" ms-on-tap="@Query(2)">已使用</a></li>
                    <!--<li class="tab-nav-item" ms-class="[@status==3&&'tab-active']"><a href="javascript:;" ms-on-tap="@Query(3)">已过期</a></li>-->
                </ul>
                <div class="coupon-list">
                	<div class="coupon-content" ms-for="el in @ListData">
                		<div  ms-class="['left-box',el.CValue<=10&&'second',el.CValue>10&&'first']">
                			<p><span>¥</span>{{el.CValue}}</p>
                		</div>
                		<div class="right-txtbox">
                			<p class="title">{{el.Title}}</p>
                			<p class="time">{{el.StartTime|date('yyyy.MM.dd')}}-{{el.EndTime|date('yyyy.MM.dd')}}<a ms-if="@status==1" href="../shequ/index.html">立即使用</a></p>
                		</div>
                	</div>
                </div>
				
                			
			</div>
		</div>

        <script src="//cdn.bootcss.com/jquery/2.0.0/jquery.min.js"></script>
        <script src="../js/ydui.js"></script>
        <script src="../js/avalon.mobile.min.js"></script>
        <script src="../js/ComFunJS.js?v=20180226"></script>
        <script>
        var model = avalon.define({
            $id: "quanlist",
            ListData: [],
            pageindex: 1,
            total:0,
            status: 1,
            GetListData: function (callback) {
                $.getJSON("/api/user/coupon/list/" + model.status, { "pageindex": model.pageindex }, function (r) {
                    if (r.error == "") {
                        model.total = r.total;
                        typeof callback == 'function' && callback.call(this, r.result);
                    }
                })
            },
            Query: function (s) {
                model.status = s;
                init();

            }
        })
        avalon.ready(function () {
            if (ComFunJS.isLogin(true)) {
                init();
            }

        })

        function init() {
            model.ListData.clear();
            model.pageindex = 1;

            $('.coupon-list').infiniteScroll({
                binder: '.g-scrollview',
                pageSize: 10,
                initLoad: true,
                backposition: true,
                jumpLink: '.J_Link',
                loadingHtml: '<img src="http://static.ydcss.com/uploads/ydui/loading/loading10.svg"/>',
                loadListFn: function () {
                    var def = $.Deferred();

                    model.GetListData(function (listArr) {
                        model.ListData.pushArray(listArr);
                        //$('.m-list').find('img').lazyLoad({ binder: '.g-scrollview' });

                        def.resolve(listArr, model.pageindex);
                        model.pageindex++;
                    })

                    return def.promise();
                },
                loadStorageListFn: function (ret, retPage) {
                    var def = $.Deferred();
                    model.pageindex = retPage;
                    ret.forEach(function (listArr) {
                        listArr.list.forEach(function (val) {
                            model.ListData.push(val);
                        });
                    });
                    model.total = model.ListData.length;
                    //$('.m-list').find('img').lazyLoad({ binder: '.g-scrollview' });
                    def.resolve();
                    return def.promise();
                }
            })

        }


        </script>

	</body>
</html>
